<template>
	<view class="page">
		<view class="bg">
			
			<!-- <view v-if='tabItem.list.length > 0' class="order-main" @tap="goOrderDetails()"> -->
				<!-- 分组 -->
				<view class="group-box1" @tap="goAdd">
					<view class="group-name1">新增分组</view>
					<uni-icons type="right" size="15" color="#999999"></uni-icons>
					<!-- <view><image src=""></image></view> -->
				</view>
				
				<view class="group-box">
					<view class="group-title">
						<view class="group-name">TV-BOX系列</view>
						<view class="group-icon">
							<image src='http://yunzhidun.oss-cn-beijing.aliyuncs.com/weixin/static/group/modify.png' class="mod"></image>
							<image src='http://yunzhidun.oss-cn-beijing.aliyuncs.com/weixin/static/group/delete.png' class="mod"></image>
						</view>
					</view>
					
					<view class="" v-show="isOpen ">
						<view class="status-box">
							<view class="status">
								<view class="status-name">在线设备（台）</view>
								<view class="status-num" style="color: #0cdd59;font-size: 36rpx;">66</view>
							</view>
							<view class="status">
								<view class="status-name">离线设备（台）</view>
								<view class="status-num" style="color: #ff0800;font-size: 36rpx;">30</view>
							</view>
							<view class="status">
								<view class="status-name">异常设备（台）</view>
								<view class="status-num" style="color: #ff7301;font-size: 36rpx;">1</view>
							</view>
						</view>
					<!-- <view class="goods-item"> -->
						<view class="det-content">
							<view class="det">
								<view class="status-name">设备量(台)</view>
								<view class="status-num" style="font-weight: 550;font-size: 28rpx;">53.22</view>
							</view>
							<view class="det">
								<view class="status-name">总收益(元)</view>
								<view class="status-num" style="font-weight: 550;font-size: 28rpx;">122.13</view>
							</view>
							<view class="det">
								<view class="status-name">昨日收益(元)</view>
								<view class="status-num" style="font-weight: 550;font-size: 28rpx;">22.11</view>
							</view>
							<view class="det">
								<view class="status-name">昨日平均(元)</view>
								<view class="status-num" style="font-weight: 550;font-size: 28rpx;">12.11</view>
							</view>
						</view>
					<!-- </view> -->
					</view>
					<view class="down">
						<view v-show="!isOpen" @tap="isOpen = !isOpen">
							<uni-icons type="down" class="icon" size="20" color="#999999"></uni-icons>
						</view>
						<view v-show="isOpen" @tap="isOpen = !isOpen">
							<uni-icons type="up" class="icon" size="20" color="#999999"></uni-icons>
						</view>
					</view>
						
					
				</view>
				
				
			<!-- </view> -->
			<!-- 
			<view class="no-grouping">
				<image class="no-grouping-img" src="http://yunzhidun.oss-cn-beijing.aliyuncs.com/weixin/static/group/Ngrouping1.png" mode="widthFix"></image>
				<view class="no-grouping-home">暂无分组</view>
				<view class="no-grouping-add" @tap="addGroup" v-if="submitBtn">立即添加</view> -->
				<!-- 
				<view class="del-group" @tap="delGroup" v-if="delBtn">删除分组</view>
				<view class="del-btn"  @tap="comDel" v-if="!delBtn">删除分组</view>
				<view class="del-group" @tap="conealDel" v-if="!delBtn">取消</view> -->
			<!-- 	<view class="boxGroup" v-if="showGroup"  @tap="conealGroup"></view>
				
				<view class="modal-group" v-if="showGroup">
					<view class="title">
						添加分组
					</view>
					<view class="content">
						<input class="name" type="text" v-model="groupName" placeholder="请输入分组名称">
					</view>
					<view class="btn-group">
						<view class="coneal-group" @tap="conealGroup">取消</view>
						<view class="submit-group" @tap="comfimGroup">确定</view>
					</view>
				</view>
			
			</view> -->
			
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				submitBtn:true,
				showGroup:false,
				delBtn:true,
				groupName:'',
				status:4,
				newRemark:'',
				show:false,
				clickId:'',
				active:1,
				showType:false,
				cri:false,
				groupList:[],
				dalArray:[],
				order:0,
				pro:[],//省
				type:0,
				isp:0,
				province:'',
				groupId:0,
				updateshow:false,
				updateName:'',
				updateId:0,
				page:1,
				brandName:'',
				headIndex:0,
				isOpen:false,
			}
		},
		methods: {
			addGroup(){
				this.showGroup = true
			},
			delGroup(){
				this.cri = true
				this.submitBtn = false
				this.delBtn = false
			},
			//取消删除
			conealDel(){
				this.cri = false
				this.submitBtn = true
				this.delBtn = true
			},
			//点击选择删除分组
			delArr(id){
				if(this.dalArray.indexOf(id) >= 0){
					this.dalArray.splice(this.dalArray.indexOf(id),1);
				}else{
					this.dalArray.push(id);
				}
				console.log(this.dalArray)
			},
			//确定删除
			comDel(){
				let userinfo = uni.getStorageSync('userinfo');
				this.$api.interfaceApi('delGroup')({
					group:this.dalArray,
					uid:userinfo.id
				}).then(res=>{
					uni.showToast({
						title:res.msg,
						icon:"none"
					})
					this.getGroupList()
				})
			},
			
			conealGroup(){
				this.showGroup = false
			},
			comfimGroup(){
				let userinfo = uni.getStorageSync('userinfo');
				this.$api.interfaceApi('addGroup')({
					'uid':userinfo.id,
					'name':this.groupName
				}).then(res=>{
					uni.showToast({
						title:res.msg,
						icon:"none"
					})
					if(res.code == 1){
						//此处应该要刷新一个列表
						this.showGroup = false
						this.getGroupList()
					}
				})
			},
			addGroup(){
				this.showGroup = true
			},
			delGroup(){
				this.cri = true
				this.submitBtn = false
				this.delBtn = false
			},
		}
	}
</script>

<style>
@import url("group.css");

</style>
